<!-- 爆款视频排行榜 -->
<template>
  <div style="padding: 20px">
    <el-radio-group v-model="searchOption">
      <el-radio :label="1">视频标题或简介</el-radio>
      <el-radio :label="2">视频标签</el-radio>
      <el-radio :label="3">视频评论</el-radio>
    </el-radio-group>
    <div class="margin-top-20">
      <el-input
        placeholder="请输入关键词搜索"
        v-model="searchText"
        style="width: 50%"
      >
      </el-input>
      <el-button>搜索视频</el-button>
      <el-button @click="clickShowMore">{{
        showMore ? "收起条件" : "搜索条件"
      }}</el-button>
    </div>
    <div style="margin-top: 10px">
      爆款视频排行榜 
    </div>
    <div style="display: flex; justify-content: space-between">
      <span>
        <el-radio-group v-model="searchPeriod">
          <el-radio-button label="日榜"></el-radio-button>
          <el-radio-button label="周榜"></el-radio-button>
          <el-radio-button label="月榜"></el-radio-button>
        </el-radio-group>
        <el-select v-model="periodValue" placeholder="请选择">
          <el-option
            v-for="item in periodValueOptions"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          >
          </el-option>
        </el-select>
        <el-button>导出</el-button>
      </span>
      <span> 更新时间：{{ lastUpdateTimeStr }} </span>
    </div>
    
    <div class="margin-top-20">
      一级分类：
      <el-radio-group v-model="classify">
        <el-radio-button
          v-for="(item, key) in classifyOptions"
          :label="item"
          :key="key"
        ></el-radio-button>
      </el-radio-group>
    </div>

    <!-- 显示结果 -->
    <div class="margin-top-20">
      <el-radio-group v-model="pageOrder">
        <el-radio-button
          v-for="(item, key) in pageOrderOptions"
          :label="item"
          :key="key"
        ></el-radio-button>
      </el-radio-group>
    </div>

    <paged-result />
  </div>
</template>

<script>
import PagedResult from "./components/PagedResult.vue";
import DataTrend from "./components/DataTrend.vue";
import CoreList from "./components/CoreList.vue";
import CommentAnalysis from "./components/CommentAnalysis.vue";
import AudiencePotait from "./components/AudiencePortrait.vue";
import BulletAnalysis from "./components/BulletAnalysis.vue";


export default {
  name: "",
  data: function () {
    return {
      lastUpdateTimeStr: "2021年2月2日 04:04:04:04",
      searchPeriod: "日榜",
      periodValue: "0617",
      classify: "全部",
      pageOrder: "新增播放",
      periodValueOptions: [{ label: "6月17日", value: "0617" }],
      classifyOptions: [
        "全部",
        "时尚",
        "生活",
        "美食",
        "动画",
        "音乐",
        "舞蹈",
        "游戏",
        "知识",
        "数码",
        "资讯",
        "鬼畜",
        "广告",
        "娱乐",
        "影视",
        "番剧",
        "国创",
        "纪录片",
        "电影",
        "电视剧",
      ],

      pageOrderOptions:[
        "新增播放",
        "新增点赞",
        "新增收藏",
        "新增评论",
        "新增投币",


      ]
    };
  },

  components: { 
    PagedResult,
    DataTrend,
    AudiencePotait,
    BulletAnalysis,
    CommentAnalysis,
    CoreList,
  
  },

  computed: {},

  mounted: function () {},

  methods: {},
};
</script>
<style lang="scss" scoped></style>
